var canvas = document.getElementById("my_canvas");
var context = document.getElementById("my_canvas").getContext("2d");


function implementcanvs() {

    // 调整canvas的清晰度搞得
    var getPixelRatio = function(context) {
        var backingStore = context.backingStorePixelRatio ||
            context.webkitBackingStorePixelRatio ||
            context.mozBackingStorePixelRatio ||
            context.msBackingStorePixelRatio ||
            context.oBackingStorePixelRatio ||
            context.backingStorePixelRatio || 1;
        return (window.devicePixelRatio || 1) / backingStore;
    };


    var mycanvasen = document.getElementsByTagName('canvas')[0]; //获取网页中的canvas对象

    var ewm =new Image();
    ewm.src = "data:image/png;base64,"+generateQRCode;

    // 背景图片
    var bangimg = new Image();
    bangimg.src = '../default/images/bang.jpg';
    bangimg.crossOrigin = "*";
    //画文字
    var ratio = getPixelRatio(context);




    canvas.width = 320;

    canvas.height = 568;

    canvas.style.width = canvas.width + 'px';
    canvas.style.height = canvas.height + 'px';

    var bangimgwidth = canvas.width;
    var bangimgheight = canvas.height;

    canvas.width = canvas.width * ratio;

    canvas.height = canvas.height * ratio;



    bangimg.onload = function() { //必须等待图片加载完成

        // 放大倍数
        context.scale(ratio, ratio);

        context.drawImage(bangimg, 0, 0, 320, 568);


        context.font = "16px 宋体";
        context.fillStyle = "#fff";

        context.drawImage(ewm, 110, 420, 100, 100);


        /*context.fillText(username,220,475);
        context.fillText(companyname,100,430);
        context.fillText(todayyear,195,495);
        context.fillText(todaymon,235,495);
        context.fillText(todayday,251,495);*/

        // drawText(myBriefIntroduction, 55, 420, 140, 200);

        context.fillText('邀请码: '+usercode,100,540);
        context.fillText('用户名: '+userName,100,557);


        var srcImg = new Image();
        srcImg.src = canvas.toDataURL('images/png');

        $('#canvasbox').html(""); //移除已生成的避免重复生成
        $('#canvasbox').append(srcImg); //imagQrDiv表示你要插入的容器id
        mui.hideLoading();//隐藏后的回调函数
        mui.toast('长按图片保存');

    };

};


// 文字溢出换行操作
function drawText(t, x, y, w) {

    var chr = t.split("");
    var temp = "";
    var row = [];

    for (var a = 0; a < chr.length; a++) {
        if (context.measureText(temp).width < w) {;
        } else {
            row.push(temp);
            temp = "";
        }
        temp += chr[a];
    }

    row.push(temp);

    for (var b = 0; b < row.length; b++) {
        context.fillText(row[b], x, y + (b + 1) * 20);
    }
}




//扩展mui.showLoading
(function($, window) {
    //显示加载框
    $.showLoading = function(message,type) {
        if ($.os.plus && type !== 'div') {
            $.plusReady(function() {
                plus.nativeUI.showWaiting(message);
            });
        } else {
            var html = '';
            html += '<i class="mui-spinner mui-spinner-white"></i>';
            html += '<p class="text">' + (message || "数据加载中") + '</p>';

            //遮罩层
            var mask=document.getElementsByClassName("mui-show-loading-mask");
            if(mask.length==0){
                mask = document.createElement('div');
                mask.classList.add("mui-show-loading-mask");
                document.body.appendChild(mask);
                mask.addEventListener("touchmove", function(e){e.stopPropagation();e.preventDefault();});
            }else{
                mask[0].classList.remove("mui-show-loading-mask-hidden");
            }
            //加载框
            var toast=document.getElementsByClassName("mui-show-loading");
            if(toast.length==0){
                toast = document.createElement('div');
                toast.classList.add("mui-show-loading");
                toast.classList.add('loading-visible');
                document.body.appendChild(toast);
                toast.innerHTML = html;
                toast.addEventListener("touchmove", function(e){e.stopPropagation();e.preventDefault();});
            }else{
                toast[0].innerHTML = html;
                toast[0].classList.add("loading-visible");
            }
        }
    };

    //隐藏加载框
    $.hideLoading = function(callback) {
        if ($.os.plus) {
            $.plusReady(function() {
                plus.nativeUI.closeWaiting();
            });
        }
        var mask=document.getElementsByClassName("mui-show-loading-mask");
        var toast=document.getElementsByClassName("mui-show-loading");
        if(mask.length>0){
            mask[0].classList.add("mui-show-loading-mask-hidden");
        }
        if(toast.length>0){
            toast[0].classList.remove("loading-visible");
            callback && callback();
        }
    }
})(mui, window);